<h:panelGroup xmlns:p='http://primefaces.org/ui'
              xmlns:f='http://java.sun.com/jsf/core'
              xmlns:h='http://java.sun.com/jsf/html' styleClass='IMBuilder' id='IMBuilder'><p:growl id='growl'/>

  <p:toolbar styleClass='toolBar'>

  <p:toolbarGroup style='width:100%;text-align: center'>

  <p:commandButton icon='ui-icon-new'  title='Nuevo'   actionListener='#{IMBuilder.uiClean}'  update='@(.IMBuilder)' style='border:none; float:left;  width:70px'/>

  <p:commandButton icon='ui-icon-save' title='Guardar' actionListener='#{IMBuilder.uiMerge}'  update='@(.IMBuilder)' style='border:none; float:left;  width:70px'/>

  <p:commandButton value='Entidad' style='border:none; font-weight:bold; background:transparent'/>

  <h:inputText value='#{IMBuilder.nameEntity}' styleClass='xIn'/>

  </p:toolbarGroup>

  </p:toolbar>


  <h:panelGrid columns='5' id='builder' styleClass='align-top' cellpadding='10'>

  <h:panelGrid columns='1'>

  <p:dataTable value='#{IMBuilder.entityLsField}' var='x' selectionMode='single' rowKey='#{x.name}' scrollWidth='330'

           emptyMessage='' scrollable='false' scrollHeight='400' selection='#{IMBuilder.selectedFieldE}'>

  <f:facet name='header'><h:outputText value='Cabecera'/></f:facet>

  <p:ajax event='rowSelect' listener='#{IMBuilder.onFieldESelect}' process=':#{formId}:builder' update='@(.IMBuilder)'/>

  <p:column headerText='Field' style='width: 70px'><h:outputText value='#{x.name}'/></p:column>

  <p:column headerText='Size'  style='width: 30px'><h:outputText value='#{x.size}'/></p:column>

  </p:dataTable>


  <p:dataTable value='#{IMBuilder.entityLsFieldSel}' var='x' selectionMode='single' rowKey='#{x.name}' scrollWidth='330'

               emptyMessage='' scrollable='false' scrollHeight='400' selection='#{IMBuilder.selectedFieldE}'>

  <p:ajax event='rowSelect'  listener='#{IMBuilder.onFieldERemove}' process=':#{formId}:builder' update='@(.IMBuilder)'/>

  <p:column headerText='Field' style='width: 70px'><h:outputText value='#{x.name}'/></p:column>

  <p:column headerText='Size'  style='width: 30px'><h:outputText value='#{x.size}'/></p:column>

  <p:column headerText='Type'  style='width: 10px'><h:inputText value='#{x.field}' size='2' maxlength='2' styleClass='xIn'/></p:column>

  </p:dataTable>

  </h:panelGrid>


  <h:panelGrid columns='1'>

  <p:dataTable value='#{IMBuilder.detailLsField}' var='x' selectionMode='single' rowKey='#{x.name}' scrollWidth='330'

               emptyMessage='' scrollable='false' scrollHeight='400' selection='#{IMBuilder.selectedFieldD}'>

  <f:facet name='header'><h:outputText value='Posicion'/></f:facet>

  <p:ajax event='rowSelect' listener='#{IMBuilder.onFieldDSelect}' process=':#{formId}:builder' update='@(.IMBuilder)'/>

  <p:column headerText='Field' style='width: 70px'><h:outputText value='#{x.name}'/></p:column>

  <p:column headerText='Size'  style='width: 30px'><h:outputText value='#{x.size}'/></p:column>

  </p:dataTable>


  <p:dataTable value='#{IMBuilder.detailLsFieldSel}' var='x' selectionMode='single' rowKey='#{x.name}' scrollWidth='330'

               emptyMessage='' scrollable='false' scrollHeight='400' selection='#{IMBuilder.selectedFieldD}'>

  <p:ajax event='rowSelect' listener='#{IMBuilder.onFieldDRemove}' process=':#{formId}:builder' update='@(.IMBuilder)'/>

  <p:column headerText='Field' style='width: 70px'><h:outputText value='#{x.name}'/></p:column>

  <p:column headerText='Size'  style='width: 30px'><h:outputText value='#{x.size}'/></p:column>

  <p:column headerText='Type'  style='width: 10px'><h:inputText value='#{x.field}' size='2' maxlength='2' styleClass='xIn'/></p:column>

  </p:dataTable>

  </h:panelGrid>


  <h:panelGrid columns='1'>

  <p:dataTable value='#{IMBuilder.detailLsColumn}' var='x' selectionMode='single' rowKey='#{x.name}' scrollWidth='330'

               emptyMessage='' scrollable='false' scrollHeight='400' selection='#{IMBuilder.selectedColumnD}'>

  <f:facet name='header'><h:outputText value='Detalle'/></f:facet>

  <p:ajax event='rowSelect' listener='#{IMBuilder.onColumnDSelect}' process=':#{formId}:builder' update='@(.IMBuilder)'/>

  <p:column headerText='Field' style='width: 70px'><h:outputText value='#{x.name}'/></p:column>

  <p:column headerText='Size'  style='width: 30px'><h:outputText value='#{x.size}'/></p:column>

  </p:dataTable>


  <p:dataTable value='#{IMBuilder.detailLsColumnSel}' var='x' selectionMode='single' rowKey='#{x.name}' scrollWidth='330'

               emptyMessage='' scrollable='false' scrollHeight='400' selection='#{IMBuilder.selectedColumnD}'>

  <p:ajax event='rowSelect' listener='#{IMBuilder.onColumnDRemove}' process=':#{formId}:builder' update='@(.IMBuilder)'/>

  <p:column headerText='Field' style='width: 70px'><h:outputText value='#{x.name}'/></p:column>

  <p:column headerText='Size'  style='width: 30px'><h:outputText value='#{x.size}'/></p:column>

  <p:column headerText='Type'  style='width: 10px'><h:inputText value='#{x.field}' size='2' maxlength='2' styleClass='xIn'/></p:column>

  </p:dataTable>

  </h:panelGrid>


  <h:panelGrid columns='1'>

  <p:dataTable value='#{IMBuilder.entityLsColumn}' var='x' selectionMode='single' rowKey='#{x.name}' scrollWidth='330'

               emptyMessage='' scrollable='false' scrollHeight='400' selection='#{IMBuilder.selectedColumnE}'>

  <f:facet name='header'><h:outputText value='Busqueda'/></f:facet>

  <p:ajax event='rowSelect' listener='#{IMBuilder.onColumnESelect}' process=':#{formId}:builder' update='@(.IMBuilder)'/>

  <p:column headerText='Field' style='width: 70px'><h:outputText value='#{x.name}'/></p:column>

  <p:column headerText='Size'  style='width: 30px'><h:outputText value='#{x.size}'/></p:column>

  </p:dataTable>


  <p:dataTable value='#{IMBuilder.entityLsColumnSel}' var='x' selectionMode='single' rowKey='#{x.name}' scrollWidth='330'

               emptyMessage='' scrollable='false' scrollHeight='400' selection='#{IMBuilder.selectedColumnE}'>

  <p:ajax event='rowSelect'  listener='#{IMBuilder.onColumnERemove}' process=':#{formId}:builder' update='@(.IMBuilder)'/>

  <p:column headerText='Field' style='width: 70px'><h:outputText value='#{x.name}'/></p:column>

  <p:column headerText='Size'  style='width: 30px'><h:outputText value='#{x.size}'/></p:column>

  <p:column headerText='Type'  style='width: 10px'><h:inputText value='#{x.field}' size='2' maxlength='2' styleClass='xIn'/></p:column>

  </p:dataTable>

  </h:panelGrid>

  </h:panelGrid>

</h:panelGroup>